{% load static %}
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>{% block title %}我的网站{% endblock %}</title>

    <!-- Bootstrap 5 CSS -->
    <link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet">

    <!-- Iconfont (可选) -->
    <link href="{% static 'bootstrap/css/iconfont.css' %}" rel="stylesheet">

    <!-- 主样式 -->
    <link href="{% static 'bootstrap/css/main.css' %}" rel="stylesheet">

    <!-- 页面级额外 CSS -->
    {% block external_header %}{% endblock %}
</head>
<body>
    {% block body %}{% endblock %}

    <!-- Bootstrap 5 Bundle (含 Popper) -->
    <script src="{% static 'bootstrap/js/bootstrap.bundle.min.js' %}" defer></script>

    <!-- 工具脚本（不含 jQuery） -->
    <script src="{% static 'bootstrap/js/util' %}" defer></script>

    <!-- 设置 CSRF Token 到 AJAX 请求头（使用原生 JS） -->
    <script>
        document.addEventListener("DOMContentLoaded", function () {
            const csrftoken = getCookie('csrftoken');

            function getCookie(name) {
                let cookieValue = null;
                if (document.cookie && document.cookie !== '') {
                    const cookies = document.cookie.split(';');
                    for (let i = 0; i < cookies.length; i++) {
                        const cookie = cookies[i].trim();
                        if (cookie.substring(0, name.length + 1) === (name + '=')) {
                            cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                            break;
                        }
                    }
                }
                return cookieValue;
            }

            // 为所有 AJAX 请求自动添加 CSRF Token（示例：fetch 或 XMLHttpRequest）
            // 如果你使用 fetch，可以在封装函数中加入：
            // headers: { 'X-CSRFToken': csrftoken }

            // 若仍使用 jQuery（不推荐），可保留原逻辑；否则可删除
            // window.csrftoken = csrftoken; // 供其他脚本使用
        });
    </script>

    <!-- 页面级额外 JS -->
    {% block external_js %}{% endblock %}
</body>
</html>